
<template>
  <el-dialog :close-on-click-modal="false" width="800px" :title="$tt('label_tms_waybill_trade_transfer')" :visible.sync="visible" custom-class="dialog_default"
    v-loading="loading" @close="hide">

    <el-form :label-width="$globalCss.formLabelWidth_default" :model="form" :rules="rules" ref="Form">
      <el-form-item label="合作情况">
        <el-select v-model="form.isRecord" placeholder="请选择合作情况">
          <el-option label="备案" value="Y" />
          <el-option label="未备案" value="N" />
        </el-select>
      </el-form-item>
      <el-form-item label="同行名称" :prop="form.isRecord==='N'?'carrierName':''">
        <div style="display: flex;">
          <el-input v-model="form.carrierName" placeholder="请输入同行名称"></el-input>
          <el-button v-show="form.isRecord==='Y'" slot="append" type="primary" style="margin-left: 10px;" @click="$refs.SuperTablePage.reload()">{{ $tt('label_query') }}</el-button>
        </div>
      </el-form-item>
      <el-form-item label="运输时效" v-if="form.isRecord==='N'" prop="prescription">
        <el-input v-model.number="form.prescription" type="number" placeholder="请输入运输时效">
            <span slot="append">{{ $t('label_pms_hour') }}</span>
        </el-input>
      </el-form-item>
      <el-form-item label="" v-show="form.isRecord==='Y'" :prop="form.isRecord==='Y'?'carrier':''" label-width="0">
        <el-radio-group v-model="form.carrier" class="w_fill">
          <ex_super_table_page ref="SuperTablePage" :autoLoad="false" v-bind="option_table" style="height: 300px;"
            @row-click="(row, column, event) => form.carrier = row">
            <template v-slot:radio="{ row }">
              <el-radio style="margin-left: 10px;" :label="row" :key="row.carrierId">{{ "" }}</el-radio>
            </template>
          </ex_super_table_page>
        </el-radio-group>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog_footer">
      <el-button @click="visible = false">{{ $tt('label_cancel') }}</el-button>
      <el-button type="primary" @click="submitReady">{{ $tt('label_submit') }}</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      waybillIds:'',
      form: {
        isRecord: 'Y',
        carrierName:'',
        prescription:1,
        carrier:null
      },
      visible: false,
      loading: false,
      items: [],
      rules: {
        carrier: {
          required: true, validator: (r, v, cb) => {
            if (!v) {
              cb(this.$tt('label_tms_select_carrier'))
            } else {
              cb()
            }
          }, trigger: 'blur'
        },
        carrierName:[{required: true,message: this.$tt('tip_can_no_empty'), trigger: 'blur'}],
        prescription:[{required: true,message: this.$tt('tip_can_no_empty'), trigger: 'blur'}]
      },
      option_table: {
        table: {
          url: "/tms-api/waybill/TmsWaybillInfoQueryRpc/selectTransferToPeer.json",
          urlParams: (params) => {
            return Object.assign({
              waybillIds: this.waybillIds,
              carrierName:this.form.carrierName
            }, params)
          },
          model: [
            { slot: "radio", },
            { key: 'carrierName', label: 'label_tms_waybill_carrier_name', 'min-width': 100, 'show-overflow-tooltip': true, },
            { key: 'prescription', label: '时效', 'min-width': 100, 'show-overflow-tooltip': true, },
            // { key: 'prescription', label: '合同签署', 'min-width': 100, 'show-overflow-tooltip': true, },
            // { key: 'serviceItemList', label: 'label_pms_add_service', 'min-width': 100, 'show-overflow-tooltip': true, },

          ]
        }

      }

    }
  },
  computed: {


  },
  methods: {
    show(data) {
      this.waybillIds = []
      data.forEach(item=>{
        this.waybillIds.push(item.id)
      })

      this.visible = true
      this.form.carrier = null
      this.items = data
      this.$nextTick(()=>{
        this.$refs.SuperTablePage.reload()
      })

      // this.queryPeer(items)
    },
    hide() {
      this.visible = false
      this.$refs['Form'].resetFields();
      this.form = {
        isRecord: 'Y',
        carrierName:'',
        prescription:1,
        carrier:null
      }
    },
    submitReady() {
      this.$refs['Form'].validate((valid) => {
        if (valid) {
          this.submit()
        } else {
          this.$message.error(this.$t('form_validate_error'))
          return false;
        }
      });
    },
    submit() {
      this.$ajax({
        url: "/tms-api/waybill/TmsWaybillInfoOperationRpc/transferToPeer.json",
        method: 'post',
        type: 'json',
        loading: true,
        data: {
          isRecord:this.form.isRecord,
          carrierId:this.form.isRecord==='Y'? this.form.carrier.carrierId:null,
          carrierName:this.form.isRecord==='Y'? this.form.carrier.carrierName:this.form.carrierName,
          prescription:this.form.isRecord==='N'? this.form.prescription:this.form.carrier.prescription,
          waybillIdAndVersionList: this.items.map(it => {
            return {
              id: it.id,
              version: it.version,
            }
          }),
        },
        success: (res) => {
          // this.$message.success(this.$tt('tip_submit_success'))
          this.$message.success('勾选的计划已经做了转同行处理，请在运输执行中完善业务转移后的相关跟踪信息!')
          this.hide()
          this.$emit('submitSuccess')
        },
      })


    },

  }
}
</script>

<style lang="less" scoped>
.el-select{
  display: block;
}

.appendUnit{
  width: 80px;
}
</style>
